<template>
	<view id="page_main_id" class="page_loading page_render" :class="{ can_show: render_req }">
		<!-- page_main  car_gradient -->
		<pagelogin ref="pagelogin" @loginready="pagerefresh" @initcallback="com_pagelogin_initcallback($event)" need_login="0">
			<diynav ref="diynav" :colorModel="color_mode" :navstyle="{ background: '#383950' }" isFixed hasHeight back :title="page_title" @settop="set_pagetop($event)"></diynav>

			<view class="page_view" v-if="objJudge(page_list)">
				<view class="help_list">
					<view class="help_view" v-for="(item, index) in page_list" :key="index" @click="goweburl_f(`/pagesC/index/com_article?id=${item.id}&type=help_list`)">
						<view class="view">
							<view class="top_info jj_kb_a">
								<view class="info ell">
									{{ item.help_title }}
								</view>
								<myimg imgsrc="/static/images/jt.png" width="26"></myimg>
							</view>
						</view>
					</view>
				</view>
			</view>
		</pagelogin>
	</view>
</template>

<script>
import storeMixin from '@/store/storeMixin';
export default {
	mixins: [storeMixin],
	data() {
		return {
			color_mode: 'dark',

			change_var: {},
			scrollTop: 0,
			render_component_init: false,
			page_render: false,
			page_title: '帮助中心',
			render_req: false,
			nextreq: true,
			carinfo: {},
			page_id: 0,
			page_form: {},
			page_data: {},
			page_list: [],
			loadingstatus: 0,
		};
	},
	onLoad(v) {
		this.page_id = v.id || 0;
		this.init_pagedata();
	},
	onShow() {
		this.com_onshow_fun();
	},
	onHide() {
		this.com_page_hide(this);
	},
	onPageScroll(e) {
		this.scrollTop = e.scrollTop;
	},
	onPullDownRefresh() {
		this.pagerefresh(1);
	},
	methods: {
		//页面刷新
		pagerefresh(type = 0) {
			let _this = this;
			_this.startPulldownJudge(type);
			_this.com_page_show(_this);
			_this.com_loading_fun();
			_this.init_page();
		},
		init_page() {
			let _this = this;
			_this.com_getdata({
				url: '/help/list',
				method: 'GET',
				id_name: '',
				data_handle_on: false,
				data: {
					pos: '',
				},
				data_fun: function (res) {
					if (res.state == 1) {
						_this.page_list = res.data;
					}
					_this.com_loading_fun({ mode: 0 });
				},
			});
		},
	},

	watch: {},
};
</script>

<style lang="scss">
// page {
//     background-color: pink;
// }

.page_view {
	padding: 20rpx;

	.help_list {
		background: #ffffff;
		border-radius: 20rpx;
		padding: 12rpx 0 22rpx;
	}

	.help_view {
		padding: 0 24rpx;

		.view {
			.top_info {
				display: flex;
				align-items: center;
				justify-content: space-between;
				height: 88rpx;
				// padding-right: 15rpx;

				.img {
					flex-shrink: 0;
					width: 26rpx;
					height: 26rpx;
				}

				.info {
					font-size: 28rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					// color: #1FD1C2
				}
			}
		}

		.bot_detail {
			font-size: 24rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #a6aab3;
			line-height: 36rpx;
			padding: 24rpx 0;
		}
	}
}
</style>
